<template>
  <div style="width: 100%; min-height: 100%">
    <BtnGroup
      :show-shopping="showShopping"
      :show="show"
      :isEditorBack="isEditorBack"
      :on-parent-return-to-list="onReturnToList"
      :on-parent-return-to-back="onReturnToBack"
    />
    <div
      style="background: #fff; margin-top: 10px; overflow-y: hidden"
      ref="main"
    >
      <slot></slot>
    </div>
  </div>
</template>

<script>
import BtnGroup from "./ButtonGroup";
import util from "../common/util";
import bus from "../assets/eventBus";
import ajax from "../common/ajax";
import api from "../common/api";
import encryption from "../common/encryption";

export default {
  name: "EditorMain",
  components: { BtnGroup },
  props: {
    show: {
      default: "visible",
    },
    isEditorBack: {
      default: false,
    },
    showShopping: {
      default: true,
    },
    onParentReturnToList: Function,
    onParentReturnToBack: Function,
  },
  mounted() {
    let main = this.$refs.main;
    let offsetTop = main.offsetTop;
    let h = util.clientHeight();
    main.style.minHeight = h - offsetTop - 20 + "px";
  },
  methods: {
    onReturnToList() {
      this.onParentReturnToList();
    },
    onReturnToBack(i, t) {
      this.onParentReturnToBack(i, t);
    },
  },
};
</script>

<style scoped>
</style>
